<template>
    <div>
        <a-modal
            title="技术审查结论"
            :visible="visible"
            @ok="handleOk"
            okText="提交"
            @cancel="visible = false"
            :width="800"
        >
            <div class="technicalReviewComments-content-box">
                <div class="technicalReviewComments-div" >
                    <span class="left-text">
                        <!-- <span style="color: red;display: inline-block;padding-top: 5px;padding-right: 3px;font-size: 18px;">*</span> -->
                        <span>办理人：</span>
                    </span>
                    <div style="display: flex;flex-direction: row;justify-content: flex-start;flex: 1;">
                        <a-textarea 
                            style="flex: 1;"
                            :readOnly="true"
                            v-model:value="formState.internalTransferName"
                            placeholder="已选办理人"
                            :autosize="{ minRows: 1, maxRows: 10000 }"
                        ></a-textarea>
                        <div>
                            <a-button class="blue-btn" @click="selectInternalTransfer" type="primary">选择办理人</a-button>
                        </div>
                        
                        <!-- <a-select
                            mode="multiple"
                            placeholder="请选择办理人"
                            style="width: 200px"
                            v-model="formState.dbrid"
                            @change="dbridChange"
                        >
                            <a-select-option v-for="(item,index) in formState.nextNodeDbrList" :key="index" :value="item.dbrid?item.dbrid:item.value">
                                {{ item.dbr?item.dbr:item.label }}
                            </a-select-option>
                        </a-select>
                        <div v-if="isDbrid" style="color: red;margin-top: 5px;">请选择办理人</div> -->
                    </div>
                    
                </div>
                <div class="technicalReviewComments-div">
                    <span class="left-text">技术审查：</span>
                    <a-radio-group class="right-text" defaultValue="1">
                        <a-radio value="1">符合</a-radio>
                    </a-radio-group>
                </div>
                <div class="technicalReviewComments-div">
                    <span class="left-text">审评类型：</span>
                    <a-radio-group class="right-text" v-model:value="formState.fclscms" @change="fclscmsChange">
                        <a-radio value="1">材料齐全需要技术审评</a-radio>
                        <a-radio value="2">免于技术审评</a-radio>
                    </a-radio-group>
                </div>
                <div style="margin-left: 175px;flex-direction: column;align-items: flex-start;" class="technicalReviewComments-div">
                    
                    <a-textarea 
                        style="width: 100%;"
                        v-model:value="formState.opinion"
                        placeholder="请输入办理意见"
                        @blur="isOpinion = formState.opinion?false:true"
                        :autosize="{ minRows: 2, maxRows: 10000 }"
                    ></a-textarea>
                    <div v-if="isOpinion" style="color: red;margin-top: 5px;">请输入审评意见</div>
                </div>
                <div class="technicalReviewComments-div">
                    <span class="left-text">发送短信提醒待办人：</span>
                    <a-radio-group class="right-text" v-model:value="formState.smgflag">
                        <a-radio value="是">是</a-radio>
                        <a-radio value="否">否</a-radio>
                    </a-radio-group>
                </div>
                <div class="technicalReviewComments-div">
                    <span class="left-text">下个环节：</span>
                    <span class="right-text">{{ formState.nextNode }}</span>
                </div>
            </div>
            <personnelList ref="personnelListRef" @checkPersonnel="checkPersonnel" :modaObj="{place:'',oldId:formState.internalTransferId?formState.internalTransferId.split(','):[]}" />
        </a-modal>
    </div>
</template>
<script>
import {
    spcysubmitFlow,
} from './service/index'
import personnelList from '../../../../../views/administrativeOffice-new/modal/personnelList.vue'
export default {
    components:{
        personnelList,
    },
    props:{
        
    },
    data(){
        return{
            formState:{},
            visible:false,
            isOpinion:false,
            isDbrid:false,
        }
    },
    watch:{

    },
    mounted(){
        
    },
    methods:{
        getData(row){
            let internalTransferName = []
            let internalTransferId = []
            row.nextNodeDbrList.forEach(item=>{
                internalTransferName.push(item.dbr?item.dbr:item.label)
                internalTransferId.push(item.dbrid?item.dbrid:item.value)
            })
            row = {
                ...row,
                smgflag:'否',
                fclscms:'1',
                opinion:'材料齐全需要技术审评',
                dbrid:[],
                internalTransferName:internalTransferName.length?internalTransferName.join(','):'',
                internalTransferId:internalTransferId.length?internalTransferId.join(','):''
            }
            this.formState = row
            
        },
        fclscmsChange(val){
            //console.log(val)
            this.formState.opinion = val.target.value == '1'?'材料齐全需要技术审评':''
        },
        dbridChange(val){
            if(val.length){
                this.isDbrid = false
            }
        },
        //选择转办办理人
        selectInternalTransfer(){
            this.$refs.personnelListRef.personnelListVisible = true
            this.$refs.personnelListRef.getData({place:'',oldId:this.formState.internalTransferId?this.formState.internalTransferId.split(','):[]})
        },
        checkPersonnel(val,list,list2){
            //console.log(val,list,list2)
            this.formState.internalTransferId = list.length?list.join(','):''
            this.formState = {
                ...this.formState,
                internalTransferName:list2.length?list2.join(','):''
            }
        },
        handleOk(){
            //console.log(this.formState.internalTransferId)
            if(this.formState.opinion){
                spcysubmitFlow({...this.formState,dbrid:this.formState.internalTransferId}).then(res=>{
                    if(res.code == 200){
                        this.visible = false
                        this.$message.success(res.message)
                        this.$emit('successTechnicalReview')
                        
                    }else{
                        this.$message.warning(res.message)
                    }
                })
            }else{
                this.isOpinion = !this.formState.opinion?true:false
                this.isDbrid = this.formState.dbrid.length?false:true
            }
        },
    }
}
</script>
<style lang="less">
.technicalReviewComments-content-box{
    .technicalReviewComments-div{
        padding: 5px 0;
        display: flex;
        align-items: center;
    }
    .left-text{
        display: flex;
        align-items: center;
        justify-content: flex-end;
        width: 170px;
        text-align: right;
        font-size: 16px;
        font-weight: 600;
        height: 32px;
        line-height: 32px;
        margin-right: 5px;
        background-color: #e6f7ff;
    }
    .right-text{
        font-size: 16px !important;
    }
    .ant-radio-wrapper{
        font-size: 16px !important;
    }
    .ant-select{
        font-size: 16px !important;
    }
}

</style>